<template>
  <div class="articles-preview">
<<<<<<< HEAD
    <el-dialog title="预览文章" :visible.sync="previewDialogFormVisible">
      <h3>111111 {{ articleInfo.title }}</h3>
      <div>
        <span>{{ articleInfo.createTime }} </span>
        <span>{{ articleInfo.username }} </span>
        <sapn> {{ articleInfo.visits }} </sapn>
=======
    <el-dialog title="预览文章" :visible.sync="previewDialogVisible" style="width=800px">
      <div class="title">
        <h2>{{ previewForm.title }}</h2>
        <div class="some">
          <span name="createTime">{{ previewForm.createTime | parseTimeByString }} </span>
          <span name="username">{{ previewForm.username }} </span>
          <span name="visits">
            <i class="el-icon-view"></i>
            {{ previewForm.visits }}
          </span>
        </div>
      </div>
      <div class="content">
        <p v-html="previewForm.articleBody"></p>
>>>>>>> 99b581ad90efc8af6413e4097d13ec8f4855db58
      </div>
      <span>{{ articleInfo.articleBody }}</span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  name: 'ArticlesPreview',
  props: {
    articleInfo: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      // 控制预览对话框的显示与隐藏
      previewDialogVisible: false
    }
  },
  computed: {},
  methods: {
    // 对话框显示
<<<<<<< HEAD
    articleShow() {
      this.previewDialogFormVisible = true
=======
    dialogShow() {
      this.previewDialogVisible = true
>>>>>>> 99b581ad90efc8af6413e4097d13ec8f4855db58
    },
    // 对话框隐藏
    dialogClosed() {
      this.previewDialogVisible = false
    }
  },
  // 挂载结束
  mounted: function() {},
  // 创建完毕状态
  created() {}
}
</script>
<style lang="less" scoped></style>
